<!DOCTYPE html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <title>Document</title>

 </head>
<script>
    function showMenu(thisa){
        thisa.style.height="180px";
    }
    function hideMenu(thisa){
        thisa.style.height="30px";
    }
  </script>
 <div onmouseover='showMenu(this)' onmouseout='hideMenu(this)' style='width: 120px;height:30px;border:1px solid blue;overflow:hidden;background:#cccccc'>
 <table>
    <tr><td >下拉菜单</td></tr>
    <tr><td>菜单一</td></tr>
    <tr><td>菜单二</td></tr>
    <tr><td>菜单三</td></tr>
    <tr><td>菜单四</td></tr>
    <tr><td>菜单五</td></tr>
 </table>
 </div>

 </body>
</html>
